<script setup>
import request from '@/utils/request'
import { onMounted, ref } from 'vue'
onMounted(() => {
    getUser()
})
const userForm = ref({
    id: JSON.parse(localStorage.getItem('loginStore')).id,
    username: '',
    password: '',
    name: '',
    address: '',
    phone: ''
})
const getUser = async () => {
    const res = await request.get('/user', {
        params: {
            id: JSON.parse(localStorage.getItem('loginStore')).id
        }
    })
    userForm.value = res.data.data
}

const upuser = async () => {
    await request.post('/upuser', userForm.value)
    ElMessage({
        type: 'success',
        message: '修改成功'
    })
}
</script>
<template>
    <div class="main">
        <el-form :model="userForm" label-position="right">
            <el-form-item label="用户名称">
                <el-input v-model="userForm.username" autocomplete="off" />
            </el-form-item>
            <el-form-item label="用户密码">
                <el-input v-model="userForm.password" autocomplete="off" />
            </el-form-item>
            <el-form-item label="收货姓名">
                <el-input v-model="userForm.name" autocomplete="off" />
            </el-form-item>
            <el-form-item label="收货地址">
                <el-input v-model="userForm.address" autocomplete="off" />
            </el-form-item>
            <el-form-item label="手机号码">
                <el-input v-model="userForm.phone" autocomplete="off" />
            </el-form-item>
        </el-form>
        <el-button type="primary" plain @click="upuser">提交信息</el-button>
    </div>
</template>
<style scoped lang="scss">
.main {
    width: 800px;
    height: 500px;
    margin: 0 auto;
    padding-top: 36px;
}
</style>